.clearfix {
  *zoom: 1;
  &:before,
  &:after {
    content: "";
    display: table;
  }
  &:after {
    clear: both;
  }
}
.mixinBorder(@top:1; @right:1; @bottom:1; @left:1; @color:#ebebf0) {
  background-image:linear-gradient(180deg, @color, @color 50%, transparent 50%),
                  linear-gradient(90deg, @color, @color 50%, transparent 50%),
                  linear-gradient(0deg, @color, @color 50%, transparent 50%),
                  linear-gradient(90deg, @color, @color 50%, transparent 50%);
  background-size: 100% @top + px, @right + px 100%, 100% @bottom + px, @left + px 100%;
  background-repeat: no-repeat;
  background-position: top, right top, bottom, left top ;
}

.mixinBorderTop(@top:1; @color:#ebebf0) {
mixinBorder(@top, 0, 0, 0, @color);
}
.mixinBorderRight(@right:1; @color:#ebebf0) {
mixinBorder(0, @right, 0, 0, @color);
}
.mixinBorderBottom(@bottom:1; @color:#ebebf0) {
mixinBorder(0, 0, @bottom, 0, @color);
}
.mixinBorderLeft(@left:1; @color:#ebebf0) {
mixinBorder(0, 0, 0, @left, @color);
}
.mixinBorderColor(@color:#ebebf0) {
mixinBorder(1, 1, 1, 1, @color);
}
.mixinBorderRadius(@width:1;@style:solid;@color:#ebebf0;@radius:2px) {
  position:relative;
    &:after{
       left:0px;
       top:0px;
       right:-100%;
       bottom:-100%;
       border-radius:@radius;
       border-width: @width + px;
       border-style: @style;
       border-color: @color;
       position:absolute;
       display:block;
       -webkit-transform:scale(0.5);
       -webkit-transform-origin:0% 0%;
       content:'';
    }
}

.mixinImages(@url;@repeat:no-repeat;@size:auto) {
    background-image:url(@url);
    background-repeat:@repeat;
    -webkit-background-size:@size;
    background-size:@size;
}
.mixinFlex() {
    display: box;
    display: -webkit-box;
    display: flex;
    display: -webkit-flex;
}
.mixinEllipsis{
  white-space: nowrap;text-overflow: ellipsis;overflow:hidden;
}
.mixinBox(@pack: center; @align: center) {
    @include flex;
    box-pack: @pack;
    box-align: @align;
    -webkit-box-pack: @pack;
    -webkit-box-align: @align;
}
.mixinFlex-y{
  -webkit-align-self: center;
  align-self: center;
}
